<template>
  <van-nav-bar class="title" :title="activeTitle" />
</template>

<script>
export default {
  data() {
    return {
      // 默认激活的标题
      activeTitle: this.$route.meta.title
    }
  },
  // 侦听路由参数对象的改变,重新给标题赋值
  watch: {
    $route(newVal) {
      // console.log(newVal)
      this.activeTitle = newVal.meta.title
    }
  }
}
</script>

<style lang="scss" scoped>
.title {
  // background-color: #0f0;
  // 固定在头部
  position: fixed;
  width: 100%;
}
</style>